<template>
  <div class="project-detail">
    <!-- 锚点定位 -->
    <div class="anchor">
      <div class="anchor-item" @click="handleClickAnchor('opportunities-info')">
        项目基本信息
      </div>
      <div class="anchor-item" @click="handleClickAnchor('task-title')">
        项目任务
      </div>
      <div class="anchor-item" @click="handleClickAnchor('group-title')">
        项目成员
      </div>
      <div class="anchor-item" @click="handleClickAnchor('approval-title')">
        项目审批
      </div>
      <div
        class="anchor-item"
        v-if="isShowRelation&&contract"
        @click="handleClickAnchor('contract-title')"
      >
        关联合同信息
      </div>
      <div
        class="anchor-item"
        v-if="isShowRelation&&businessOne"
        @click="handleClickAnchor('dynamic-title')"
      >
        关联商机信息
      </div>
      <div
        class="anchor-item"
        v-if="isShowRelation&&clueDoOne"
        @click="handleClickAnchor('clue-info')"
      >
        关联线索信息
      </div>
    </div>
    <div class="clueDetail">
      <!-- 项目名称 -->
      <router-header title="项目详情">
        <div slot="right-btn" style="float: right">
          <el-button
            type="primary"
            size="small"
            v-if="infoDetail.verifyStatus === 7"
            @click="handleClickProjectreview"
            >项目复盘</el-button
          >
          <el-button
            type="primary"
            size="small"
            v-if="(infoDetail.verifyStatus === 5||infoDetail.verifyStatus === 8)&&infoDetail.pigeonholeState === 1 && infoDetail.isStateDelete == 1&&isShow==1"
            @click="handleClickProjectArchive"
            >项目归档</el-button
          >
          <span class="project-status">{{
            infoDetail.verifyStatus | projectVerifyStatusFilter
          }}</span>
        </div>
      </router-header>
      <div style="margin-right:120px;">
        <!-- 基本信息 -->
        <div class="form-single-fragment" style="position: relative">
          <el-form :model="infoDetail" size="mini" label-position="right">
            <el-row :gutter="20">
              <el-col :span="24" class="clue-title">{{
                infoDetail.projectName
              }}</el-col>
              <el-col :span="8">
                <el-form-item label="创建日期：">{{
                  infoDetail.createTime
                    ? infoDetail.createTime.substring(0, 10)
                    : ""
                }}</el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="录入部门：">{{
                  infoDetail.deptName
                }}</el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="录入人：">{{
                  infoDetail.createUserName
                }}</el-form-item>
              </el-col>
              <el-col :span="24" class="line"></el-col>
            </el-row>
            <!-- 项目基本信息 -->
            <div ref="opportunities-info">
              <el-row :gutter="20">
                <el-col :span="24" class="clue-title" style="display: block">
                  基本信息
                  <span style="font-size: 14px; color: #aaaaaa; margin-left: 10px"
                    >项目编号 {{ infoDetail.projectCode }}</span
                  ></el-col
                >
                <el-col :span="12">
                  <el-form-item label="企业名称：">{{
                    infoDetail.customerName
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="企业联系人：">
                    <span>{{ infoDetail.contacts }}</span>
                    <span style="margin-left: 10px">{{
                      infoDetail.telephone
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="业务类型：">{{
                    infoDetail.businessTypeNameList &&
                    infoDetail.businessTypeNameList.length > 0
                      ? infoDetail.businessTypeNameList.toString()
                      : ""
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="采购方式：">{{
                    infoDetail.procurement
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="所在地区：">{{
                    infoDetail.parentName ? infoDetail.parentName.join("") : ""
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="预计合同金额：">
                    {{infoDetail.estimatedAmount}} {{infoDetail.units}}
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="预计成交日期：">{{
                    infoDetail.estimatedDate
                  }}</el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="附件：">
                    <Upload v-model="infoDetail.filePath" fielState="1" readonly :id="infoDetail.id"></Upload>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="备注：">{{
                    infoDetail.note
                  }}</el-form-item>
                </el-col>
                <el-col :span="24" class="line"></el-col>
              </el-row>
            </div>
            <!-- 项目审批进度 -->
            <div ref="approval-progress">
              <el-row :gutter="20">
                <el-col :span="24" class="clue-title"> 项目审批进度 </el-col>
                <el-col :span="24" class="clue-title">
                  <el-steps :active="2" align-center>
                    <el-step
                      v-for="(item, i) in processTask"
                      :key="i"
                      :status="
                        item.state == 0
                          ? 'wait'
                          : item.state == 1
                          ? 'success'
                          : item.state == 2
                          ? 'error'
                          : ''
                      "
                      :title="item.userName"
                    >
                      <div slot="description">
                        <p>{{ item.approvalOpinion }}</p>
                        <p>{{ item.createDate }}</p>
                      </div>
                    </el-step>
                  </el-steps>
                </el-col>
              </el-row>
            </div>
          </el-form>
        </div>
        <!-- 项目任务 -->
        <div class="line"></div>
        <div class="clue-title" ref="task-title">项目任务</div>
        <div v-for="(item, i) in projectInitiationTasks" :key="i">
          <h4 style="display: flex; justify-content: space-between">
            {{ item[0].businessTypeName }} - 标段{{
              (item[0].stageNumber - 1) | stageNumberFilter
            }}
            <el-button
              type="success"
              @click="handleClickAddBtn(item)"
              v-if="infoDetail.isProjectTaskState == 1&&infoDetail.verifyStatus < 5"
              >添加</el-button
            >
          </h4>
          <el-table
            :data="item"
            size="mini"
            style="width: 100%"
            header-cell-class-name="table-header-gray"
            v-loading="isShowloading"
          >
            <el-table-column
              type="index"
              align="center"
              width="55"
              label="序号"
            ></el-table-column>
            <el-table-column
              prop="task"
              align="center"
              width="150"
              label="任务名称"
              show-overflow-tooltip
              ><template slot-scope="scope">
                <span :class="{ require: !!scope.row.achievementFlag }">
                  {{ scope.row.task }}</span
                >
              </template>
            </el-table-column>
            <el-table-column
              prop="taskStatus"
              align="center"
              width="150"
              label="任务状态"
              show-overflow-tooltip
            >
              <template slot-scope="{ row }">
                {{ row.taskStatus | statusFilter }}
              </template>
            </el-table-column>
            <!-- <el-table-column
              prop="taskDesc"
              align="center"
              label="成果文件"
              show-overflow-tooltip
            ></el-table-column>
            <el-table-column
              prop="fileUrl"
              align="center"
              label="附件"
              show-overflow-tooltip
            ></el-table-column> -->
            <el-table-column
              prop="sealIsNo"
              align="center"
              label="是否盖章"
              show-overflow-tooltip
            >
              <template slot-scope="scope">
                {{scope.row.sealIsNo==0?'否':'是'}}
              </template>
            </el-table-column>
            <el-table-column
              prop="reviewStatus"
              align="center"
              label="审批状态"
              show-overflow-tooltip
            >
              <template slot-scope="{ row }">
                {{ row.reviewStatus | reviewStatusFilter }}
              </template>
            </el-table-column>
            <!-- <el-table-column
              prop="customerName"
              align="center"
              label="审批意见"
              show-overflow-tooltip
            >
              <template slot-scope="{ row }">
                {{ row.createUserName }},{{ row.createTime }}
              </template>
            </el-table-column> -->
            <el-table-column
              label="操作"
              align="center"
              fixed="right"
              width="220"
            >
              <template slot-scope="{ row }">
                <el-button
                  type="text"
                  v-if="infoDetail.verifyStatus >= 3 && row.taskStatus === 1"
                  @click="handleClickTaskItem(row, 'deliver')"
                  >成果交付</el-button
                >
                <el-button
                  type="text"
                  v-if="row.reviewStatus === 2 && infoDetail.isStateDelete == 1"
                  @click="handleClickTaskItem(row, 'reissue')"
                  >重新发起</el-button
                >
                <!-- <el-button
                  type="text"
                  v-if="row.taskStatus === 2 && row.isInitiationProcess == 2"
                  @click="handleClickTaskItem(row, 'approval')"
                  >审批</el-button
                > -->
                <el-button
                  v-if="row.taskStatus === 2"
                  type="text"
                  @click="handleClickTaskResult(row)"
                  >任务成果</el-button
                >
                <el-button type="text" @click="handleClickTaskItem(row, 'detail')"
                  >查看详情</el-button
                >
                <el-button
                  type="text"
                  v-if="infoDetail.isStateDelete == 1&&row.achievementFlag!=1"
                  @click="handleDeleteTask(row)"
                  >删除</el-button
                >
                <el-tooltip v-else effect="dark" :disabled="false" content="核心任务不能删除" placement="top-start">
                  <div class="del-disabled">删除</div>
                </el-tooltip>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!-- 项目成员 -->
        <div class="line"></div>
        <div class="clue-title" ref="group-title">
          项目成员
          <el-button
            type="success"
            v-if="infoDetail.isStateDelete == 1&&infoDetail.verifyStatus < 5"
            @click="setPeople"
          >
            添加
          </el-button>
        </div>
        <el-table
          :data="projectUsers"
          size="mini"
          key="projectUsers"
          style="width: 100%"
        >
          <el-table-column
            type="index"
            align="center"
            width="55"
            label="序号"
          ></el-table-column>
          <el-table-column
            prop="createName"
            align="center"
            label="姓名"
          >
            <template slot-scope="scope">
              {{scope.row.createName}}
            </template>
          </el-table-column>
          <el-table-column
            prop="mobile"
            align="center"
            label="手机号"
          >
            <template slot-scope="scope">
              {{scope.row.mobile}}
            </template></el-table-column>
          <el-table-column prop="leaderFlag" align="center" label="项目角色">
            <template slot-scope="scope">
              {{ scope.row.leaderFlag | leaderFlagFilter }}
            </template>
          </el-table-column>
          <el-table-column
            prop="deptName"
            align="center"
            label="部门"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              {{ scope.row.deptName || scope.row.deptIdDictMapname }}
            </template>
          </el-table-column>
          <el-table-column prop="jobs" align="center" label="岗位">
            <template slot-scope="scope">
              {{ scope.row.jobs }}
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="120">
            <template slot-scope="scope">
              <el-button
                type="text"
                @click="deleteUserDtoList(scope.row, scope.$index)"
                v-if="infoDetail.isStateDelete == 1&&scope.row.leaderFlag!=0"
                >删除</el-button
              >
              <el-tooltip v-else-if="scope.row.leaderFlag==0" effect="dark" :disabled="false" content="负责人不能删除" placement="top-start">
                <div class="del-disabled">删除</div>
              </el-tooltip>
            </template>
          </el-table-column>
        </el-table>

        <!-- 项目审批 -->
        <div class="line"></div>
        <div class="clue-title" ref="approval-title">
          项目审批<el-button
            type="success"
            @click="addProjectApproval"
            v-if="infoDetail.isStateDelete == 1&&(infoDetail.verifyStatus < 5 || (infoDetail.verifyStatus == 5&&infoDetail.pigeonholeState != 1))"
            >添加</el-button
          >
        </div>
        <el-table
          :data="approvalList"
          size="mini"
          key="approval"
          style="width: 100%"
          v-loading="isShowloading"
        >
          <el-table-column
            type="index"
            align="center"
            width="55"
            label="序号"
          ></el-table-column>
          <el-table-column
            prop="examinationApprovalType"
            align="center"
            label="审批类型"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <span>{{
                scope.row.examinationApprovalType | approvalTypeFilter
              }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="state"
            align="center"
            label="审批状态"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <span>{{ scope.row.verifyStatus | verifyStatusFilter }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="submissionDate"
            align="center"
            label="提交日期"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              {{scope.row.submissionDate}}
            </template>
          </el-table-column>
          <el-table-column
            prop="userName"
            align="center"
            label="创建人"
            show-overflow-tooltip
          >
            <template slot-scope="{ row }">
              {{ row.userName }},{{ row.founderDepartment }}
            </template>
          </el-table-column>
          <el-table-column label="审批意见" align="center" fixed="right">
            <template slot-scope="{ row }">
              <el-button type="text" @click="handleClickViewApprovalOpinion(row)"
                >查看</el-button
              >
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" fixed="right" width="220">
            <template slot-scope="{ row }">
              <el-button type="text" @click="handleClickDetail(row)">
                查看详情
              </el-button>
              <!-- <el-button
                type="text"
                v-if="row.showApproval === 1"
                @click="handleClickApprovalDetail(row)"
              >
                审批
              </el-button> -->
              <el-button
                type="text"
                v-if="row.showAgain === 1"
                @click="againAddProjectApproval(row)"
              >
                重新发起
              </el-button>
              <el-button
                type="text"
                v-if="row.showDel === 1"
                @click="handleClickDelApproval(row)"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- 项目归档 -->
        <div class="line" v-if="infoDetail.verifyStatus >= 6"></div>
        <div
          class="clue-title"
          ref="approval-title"
          v-if="infoDetail.verifyStatus >= 6"
        >
          项目归档
        </div>
        <div v-if="infoDetail.verifyStatus >= 6">
          <el-table
            :data="archiveDetail.projectInitiationTaskServiceOne"
            size="mini"
            style="width: 100%"
            key="archive"
          >
            <el-table-column
              type="index"
              align="center"
              width="55"
              label="序号"
            ></el-table-column>
            <el-table-column
              prop="task"
              align="center"
              label="文件/任务名称"
            ></el-table-column>
            <el-table-column prop="accessoryList" align="center" label="附件">
              <template slot-scope="{ row }">
                <el-popover
                  placement="top"
                  trigger="click">
                  <Upload v-model="row.accessoryList" fielState="11" :id="row.id" readonly></Upload>
                  <div
                    slot="reference"
                    style="font-size: 15px; color: #1188ff; cursor: pointer; text-decoration:underline;"
                  >
                    {{row.accessoryList&&row.accessoryList.length>0?row.accessoryList.length:0}}个
                  </div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column
              prop="userName"
              align="center"
              label="创建人"
            ></el-table-column>
            <el-table-column
              prop="createTime"
              align="center"
              label="创建时间"
            ></el-table-column>
          </el-table>
          <div style="margin: 20px 0">
            <el-steps align-center>
              <el-step
                v-for="(item, i) in archiveDetail.projectProcessArchives"
                :key="i"
                :status="
                  item.state == 0
                    ? 'wait'
                    : item.state == 1
                    ? 'success'
                    : item.state == 2
                    ? 'error'
                    : ''
                "
                :title="item.userName"
              >
                <div slot="description">
                  <p>{{ item.approvalOpinion }}</p>
                  <p>{{ item.createDate }}</p>
                </div>
              </el-step>
            </el-steps>
          </div>
        </div>
        <div class="line"></div>
        <div
          class="relation-show"
          v-if="contract||businessOne||clueDoOne"
          @click="
            isShowRelation = !isShowRelation;
            handleClickAnchor('contract-title');
          "
        >
          {{ `${!isShowRelation ? "展开" : "折叠"}关联合同/商机/线索信息`
          }}<i class="el-icon-arrow-up" v-if="isShowRelation"></i
          ><i class="el-icon-arrow-down" v-else></i>
        </div>
        <!-- 关联合同信息 -->
        <div ref="contract-title" style="padding-top: 20px" v-if="isShowRelation&&contract">
          <div class="clue-title">关联合同信息</div>
          <div v-loading="loading">
            <el-form :model="contract" size="mini" label-position="right">
              <el-row :gutter="20">
                <el-col :span="24" class="clue-title"
                  >{{ contract.contractName || ""
                  }}<span
                    style="font-size: 14px; color: #aaaaaa; margin-left: 10px"
                    >合同编号 {{ contract.contractCode || "" }}</span
                  >
                </el-col>
                <el-col :span="6">
                  <el-form-item label="创建日期：">{{
                    contract.createTime
                      ? contract.createTime.substring(0, 10)
                      : ""
                  }}</el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="录入部门：">{{
                    contract.deptName || ""
                  }}</el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="录入人：">{{
                    contract.createUserName || ""
                  }}</el-form-item>
                </el-col>
                <el-col :span="24" class="line"></el-col>
              </el-row>
            </el-form>
          </div>
        </div>
        <!-- 关联商机信息 -->
        <div ref="dynamic-title" style="padding-top: 20px" v-if="isShowRelation&&businessOne">
          <div class="clue-title">关联商机信息</div>
          <el-form
            :model="businessOne"
            size="mini"
            class="clue-form"
            label-position="right"
          >
            <el-row :gutter="20">
              <el-col :span="24" class="clue-title">{{
                businessOne.oppoName || ""
              }}</el-col>
              <el-col :span="6">
                <el-form-item label="创建日期：">{{
                  businessOne.createTime || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="录入部门：">{{
                  businessOne.deptName || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="录入人：">{{
                  businessOne.showName || ""
                }}</el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="clue-title" style="font-size: 16px">商机动态</div>
          <div class="dynamic" v-loading="loading">
            <div
              class="dynamic-item"
              v-for="(item, index) in oppoDynamicList"
              :key="index"
            >
              <div style="flex-shrink: 0">
                <img
                  class="avatar"
                  src="@/assets/img/default-header.png"
                  alt=""
                />
                <div class="name">{{ item.userName }}，{{ item.deptNmae }}</div>
              </div>
              <div style="margin-left: 20px">
                <div class="dynamic-content">
                  {{ item.dynamicsContent }}
                </div>
                <div class="dynamic-time">发布于{{ item.createTime }}</div>
              </div>
            </div>
            <el-pagination
              background
              @size-change="handleSizeChangeOppo"
              @current-change="handleCurrentChangeOppo"
              :current-page="oppoqueryParams.current"
              :page-size="oppoqueryParams.size"
              :page-sizes="[10, 20, 50, 100]"
              layout="total, prev, pager, next, sizes"
              :total="oppoDynamicTotal"
              v-if="oppoDynamicTotal > 0"
            ></el-pagination>
          </div>
        </div>
        <!-- 线索动态 -->
        <div ref="clue-info" style="padding-top: 20px" v-if="isShowRelation&&clueDoOne">
          <div class="clue-title">关联线索信息</div>
          <el-form
            :model="clueDoOne"
            size="mini"
            class="clue-form"
            label-position="right"
          >
            <el-row :gutter="20">
              <el-col :span="24" class="clue-title">{{
                clueDoOne.clueName || ""
              }}</el-col>
              <el-col :span="6">
                <el-form-item label="创建日期：">{{
                  clueDoOne.createTime || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="线索录入部门：">{{
                  clueDoOne.deptName || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="线索录入人：">{{
                  clueDoOne.createUserName || ""
                }}</el-form-item>
              </el-col>
              <!-- <el-col :span="24" class="line"></el-col> -->
              <el-col :span="24" class="clue-title">线索基本信息</el-col>
              <el-col :span="12">
                <el-form-item label="企业名称：">{{
                  clueDoOne.customerName || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="企业联系人：">
                  <span>{{ clueDoOne.contacts || "" }}</span>
                  <span style="margin-left: 10px">{{
                    clueDoOne.telephone || ""
                  }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="业务类型：">{{
                  clueDoOne.businessTypeName
                }}</el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="所在地区：">{{
                  clueDoOne.parentName ? clueDoOne.parentName.join("") :""}}</el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="线索来源：">{{
                  clueDoOne.clueSource || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="企业属性：">{{
                  clueDoOne.productIntention || ""
                }}</el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="线索概况：">{{
                  clueDoOne.clueContent || ""
                }}</el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="clue-title" style="font-size: 16px">线索动态</div>
          <div class="dynamic" v-loading="loading">
            <div
              class="dynamic-item"
              v-for="(item, index) in clueDynamicList"
              :key="index"
            >
              <div style="flex-shrink: 0">
                <img
                  class="avatar"
                  src="@/assets/img/default-header.png"
                  alt=""
                />
                <div class="name">{{ item.userName }}，{{ item.deptNmae }}</div>
              </div>
              <div style="margin-left: 20px">
                <div class="dynamic-content">
                  {{ item.dynamicsContent }}
                </div>
                <div class="dynamic-time">发布于{{ item.createTime }}</div>
              </div>
            </div>
            <el-pagination
              background
              @size-change="handleSizeChangeClue"
              @current-change="handleCurrentChangeClue"
              :current-page="cluequeryParams.current"
              :page-size="cluequeryParams.size"
              :page-sizes="[10, 20, 50, 100]"
              layout="total, prev, pager, next, sizes"
              :total="clueDynamicTotal"
              v-if="clueDynamicTotal > 0"
            ></el-pagination>
          </div>
        </div>
      </div>
      <!-- 项目任务 -->
      <el-dialog
        title=""
        :visible.sync="taskDialog"
        width="800px"
        v-if="taskDialog"
      >
        <el-form
          :model="infoDetail"
          size="mini"
          label-position="right"
          v-if="taskDialogType !== 'deliver'"
        >
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title" style="display: block">
              项目基本信息
              <span style="font-size: 14px; color: #aaaaaa; margin-left: 10px"
                >项目编号 {{ infoDetail.projectCode }}</span
              ></el-col
            >
            <el-col :span="12">
              <el-form-item label="企业名称：">{{
                infoDetail.customerName
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="企业联系人：">
                <span>{{ infoDetail.contacts }}</span>
                <span style="margin-left: 10px">{{
                  infoDetail.telephone
                }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="业务类型：">{{
                infoDetail.businessTypeNameList &&
                infoDetail.businessTypeNameList.length > 0
                  ? infoDetail.businessTypeNameList.toString()
                  : ""
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所在地区：">{{
                infoDetail.parentName ? infoDetail.parentName.join("") : ""
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="预计合同金额：">
                {{infoDetail.estimatedAmount}} {{infoDetail.units}}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="预计成交日期：">{{
                infoDetail.estimatedDate
              }}</el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目概况：">{{
                infoDetail.note
              }}</el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <!-- 添加 -->
        <el-form
          :model="taskData"
          size="mini"
          label-position="right"
          label-width="120px"
          v-if="taskDialogType === 'add' || taskDialogType === 'reissue'"
          :rules="allRules"
          ref="taskForm"
        >
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title">添加任务</el-col>
            <el-col :span="12">
              <el-form-item label="任务名称：" prop="task">
                <el-input
                  class="filter-item"
                  v-model="taskData.task"
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务说明：" prop="planDescription">
                <el-input
                  class="filter-item"
                  v-model="taskData.planDescription"
                  placeholder="请输入任务说明/要求"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务执行人：" prop="executor">
                <el-select
                  ref="selectExecutor"
                  multiple
                  style="display: block"
                  v-model="taskData.executor"
                  placeholder="请选择"
                  @change="selectExecutor"
                >
                  <el-option
                    v-for="item in projectUsers"
                    :key="item.userId"
                    :label="item.createName"
                    :value="item.userId"
                  >
                  </el-option>
                </el-select>
                <!-- <WorkflowSelect
                  v-model="taskData.executor"
                  class="workflow-select"
                ></WorkflowSelect> -->
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要盖章：" prop="sealIsNo">
                <el-select v-model="taskData.sealIsNo" placeholder="请选择">
                  <el-option label="是" :value="1"></el-option>
                  <el-option label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="是否需要审核：" prop="examine">
                <el-select v-model="taskData.examine" placeholder="请选择">
                  <el-option label="是" :value="1"></el-option>
                  <el-option label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="taskData.examine == 1">
              <el-form-item label="审批流：">
                <approver1 :approverList="taskData.approver" :role="true" :typeId="typeId"  @handleChooseapprover="handleChooseApproverTask"/>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="抄送：">
                <approverRoleCc :approverList="taskData.roleCcList" :readonly="false" :isCc="true" :role="true" @handleChooseapprover="handleChooseapproverRoleCc"></approverRoleCc>
                <approverUserCc :approverList="taskData.userCcList" :readonly="false" :isCc="true" @handleChooseapprover="handleChooseapproverUserCc"></approverUserCc>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务开始日期：" prop="startTime">
                <el-date-picker
                  v-model="taskData.startTime"
                  type="datetime"
                  align="right"
                  unlink-panels
                  placeholder="请选择"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务结束日期：" prop="completionTime">
                <el-date-picker
                  v-model="taskData.completionTime"
                  type="datetime"
                  align="right"
                  unlink-panels
                  placeholder="请选择"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="附件：">
                <!-- :id="details.id" -->
                <Upload v-model="taskData.accessory" :limit="10" fielState="14" ></Upload>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注：" prop="remarks">
                <el-input
                  type="textarea"
                  show-word-limit
                  :maxlength="150"
                  rows="4"
                  class="input-item"
                  v-model="taskData.remarks"
                  placeholder="输入注意事项，支持150个字符"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <!-- 详情,交付 -->
        <el-form
          :model="taskDetail"
          size="mini"
          label-position="right"
          label-width="110px"
          v-else
        >
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title">任务详情</el-col>
            <el-col :span="12">
              <el-form-item label="任务名称：">
                {{ taskDetail.task }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务说明：">
                {{ taskDetail.planDescription }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务执行人：">
                {{
                  taskDetail.executorName &&
                  taskDetail.executorName.join(",")
                }}
                <!-- {{ taskDetail.executor }} -->
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要盖章：">
                {{ taskDetail.sealIsNo == 0 ? "否" : "是" }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务开始日期：">
                {{ taskDetail.startTime }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务结束日期：">
                {{ taskDetail.completionTime }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要审核：">
                {{ taskDetail.examine == 0 ? "否" : "是" }}
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="taskDetail.examine == 1">
              <el-form-item label="审批流：">
                <approver2 :readonly="true" :approverList="taskDetail.approver" typeId="3"></approver2>
              </el-form-item>
              <!-- <el-form-item label="审批流：">
                {{
                  taskDetail.projectInitiationProcesses &&
                  taskDetail.projectInitiationProcesses.length > 0
                    ? taskDetail.projectInitiationProcesses
                        .map((item) => item.userName)
                        .toString()
                    : ""
                }}
              </el-form-item> -->
            </el-col>
            <el-col :span="24">
              <el-form-item label="抄送：">
                <approverRoleCc :approverList="taskDetail.roleCcList" :readonly="true" :isCc="true" :role="true" @handleChooseapprover="handleChooseapproverRoleCc"></approverRoleCc>
                <approverUserCc :approverList="taskDetail.userCcList" :readonly="true" :isCc="true" @handleChooseapprover="handleChooseapproverUserCc"></approverUserCc>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注：">{{
                taskDetail.remarks
              }}</el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="附件：">
                <Upload v-model="taskDetail.accessory" fielState="14" :id="taskDetail.id" readonly></Upload>
              </el-form-item>
            </el-col>
            <div v-if="taskDialogType === 'deliver'">
              <el-col :span="12">
                <el-form-item label="实际开始日期：">
                  <el-date-picker
                    v-model="deliverData.startDateTime"
                    type="datetime"
                    align="right"
                    unlink-panels
                    placeholder="请选择"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="实际完成日期：">
                  <el-date-picker
                    v-model="deliverData.endDateTime"
                    type="datetime"
                    align="right"
                    unlink-panels
                    placeholder="请选择"
                    format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="任务反馈成果：">
                  <el-input
                    class="filter-item"
                    v-model="deliverData.taskFeedback"
                    placeholder="请输入任务说明/要求"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="抄送：">
                  <el-select
                    v-model="deliverData.cc"
                    multiple
                    filterable
                    remote
                    reserve-keyword
                    :remote-method="remoteMethod"
                    :loading="executorLoading"
                    style="display: block"
                    class="multiple-select"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in executorList"
                      :key="item.userId"
                      :label="item.showName"
                      :value="item.userId"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="附件：">
                  <Upload v-model="deliverData.accessoryList" fielState="11" :limit="10"></Upload>
                </el-form-item>
              </el-col>
            </div>
            <!-- approval -->
            <div v-if="taskDialogType === 'approval'" class="approval-group-radio">
              <el-form-item label="是否通过" prop="state">
                <el-radio-group
                  v-model="approvalForm.state"
                  style="position: relative; top: 90px; right: 270px"
                >
                  <el-radio :label="1">是</el-radio>
                  <el-radio :label="2">否</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="原因" prop="approvalOpinion">
                <el-input
                  class="input-item"
                  v-model="approvalForm.approvalOpinion"
                  placeholder="请输入"
                  maxlength="20"
                ></el-input>
              </el-form-item>
            </div>
          </el-row>
        </el-form>
        <span
          slot="footer"
          class="dialog-footer"
          v-if="taskDialogType !== 'detail'"
        >
          <el-button @click="taskDialog = false">取 消</el-button>
          <el-button
            type="primary"
            @click="handleClickAddTask"
            v-if="taskDialogType === 'add' || taskDialogType === 'approval' || taskDialogType === 'reissue'"
            >确 定</el-button
          >
          <el-button type="primary" v-else @click="handleClickDeliver"
            >提 交</el-button
          >
        </span>
      </el-dialog>
      <!-- 任务成果 -->
      <el-dialog
        title="任务成果"
        :visible.sync="taskResultDialog"
        width="800px"
        v-if="taskResultDialog"
      >
        <!-- 详情,交付 -->
        <el-form
          :model="taskData"
          size="mini"
          label-position="right"
          label-width="110px"
        >
          <el-row :gutter="20">
            <el-col :span="12">
              <el-form-item label="任务名称：">
                {{ taskDetail.task }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务说明：">
                {{ taskDetail.planDescription }}
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="任务执行人：">
                {{
                  taskDetail.executorName &&
                  taskDetail.executorName.join(",")
                }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要盖章：">
                {{ taskDetail.sealIsNo == 0 ? "否" : "是" }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="是否需要审核：">
                {{ taskDetail.examine == 0 ? "否" : "是" }}
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="审批流：">
                <approver2 :readonly="true" :approverList="taskDetail.approver" typeId="3"></approver2>
                <!-- {{
                  taskDetail.projectInitiationProcesses &&
                  taskDetail.projectInitiationProcesses.length > 0
                    ? taskDetail.projectInitiationProcesses
                        .map((item) => item.userName)
                        .toString()
                    : ""
                }} -->
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="抄送：">
                <approverRoleCc :approverList="taskDetail.roleCcList" :readonly="true" :isCc="true" :role="true" @handleChooseapprover="handleChooseapproverRoleCc"></approverRoleCc>
                <approverUserCc :approverList="taskDetail.userCcList" :readonly="true" :isCc="true" @handleChooseapprover="handleChooseapproverUserCc"></approverUserCc>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务开始日期：">
                {{ taskDetail.startTime }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务结束日期：">
                {{ taskDetail.completionTime }}
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注：">{{
                taskDetail.remarks
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="实际开始日期：">
                {{ taskDetail.startDateTime }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="实际完成日期：">
                {{ taskDetail.endDateTime }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务反馈成果：">
                {{ taskDetail.taskFeedback }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="抄送：">
                {{
                  taskDetail.ccListName ? taskDetail.ccListName.toString() : ""
                }}
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="附件：">
                <Upload v-model="taskDetail.accessoryList" fielState="11" :id="taskDetail.id" readonly></Upload>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-dialog>
      <div class="annotation" v-if="selectPeoplebox">
        <selectPeople
          ref="selectPeople"
          @getPeople="getPeople"
          v-model="selectPeoplebox"
        ></selectPeople>
      </div>
      <!-- 商机审批 -->
      <el-dialog
        title=""
        :visible.sync="approvalDialog"
        width="800px"
        @closed="approvalDialogType = 'add'"
        destroy-on-close
      >
        <el-form :model="detailData" size="mini" label-position="right">
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title" style="display: block">
              项目基本信息
              <span style="font-size: 14px; color: #aaaaaa; margin-left: 10px"
                >项目编号 {{ infoDetail.projectCode }}</span
              ></el-col
            >
            <el-col :span="12">
              <el-form-item label="企业名称：">{{
                infoDetail.customerName
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="企业联系人：">
                <span>{{ infoDetail.contacts }}</span>
                <span style="margin-left: 10px">{{
                  infoDetail.telephone
                }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="业务类型：">{{
                infoDetail.businessTypeNameList &&
                infoDetail.businessTypeNameList.length > 0
                  ? infoDetail.businessTypeNameList.toString()
                  : ""
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所在地区：">{{
                infoDetail.parentName ? infoDetail.parentName.join("") : ""
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="预计合同金额：">
                {{infoDetail.estimatedAmount}} {{infoDetail.units}}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="预计成交日期：">{{
                infoDetail.estimatedDate
              }}</el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="项目概况：">{{
                infoDetail.note
              }}</el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <!-- 添加 -->
        <el-form
          :model="approvalData"
          size="mini"
          label-position="right"
          label-width="110px"
          v-if="approvalDialogType === 'add'"
          :rules="allRules"
          ref="approvalForm"
        >
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title">审批信息填写</el-col>
            <el-col :span="24">
              <el-form-item label="审批类型：" prop="approvalType">
                <el-radio-group v-model="approvalData.approvalType">
                  <el-radio :label="1">费用审批</el-radio>
                  <el-radio :label="2">盖章审批</el-radio>
                  <el-radio :label="3">用车审批</el-radio>
                  <el-radio :label="4">投标审批</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="招标方式：" prop="biddingMethod">
                <el-radio-group v-model="approvalData.biddingMethod">
                  <el-radio :label="1">公开招标</el-radio>
                  <el-radio :label="2">邀标</el-radio>
                  <el-radio :label="3">议标</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报名平台：" prop="registrationPlatform;">
                <el-input
                  class="filter-item"
                  v-model="approvalData.registrationPlatform"
                  placeholder="请输入报名平台"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报名日期：" prop="registrationDate">
                <el-date-picker
                  v-model="approvalData.registrationDate"
                  type="datetime"
                  align="right"
                  unlink-panels
                  placeholder="请选择"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="开标日期：" prop="openingDate">
                <el-date-picker
                  v-model="approvalData.openingDate"
                  type="datetime"
                  align="right"
                  unlink-panels
                  placeholder="请选择"
                  format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="approvalData.cooperativeProject === 1 ? 12 : 24">
              <el-form-item
                label="是否为合作投标项目："
                label-width="180px"
                prop="cooperativeProject"
              >
                <el-radio-group v-model="approvalData.cooperativeProject">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="approvalData.cooperativeProject === 1">
              <el-form-item label="合作方：" prop="partners">
                <el-input
                  class="filter-item"
                  v-model="approvalData.partners"
                  placeholder="请输入"
                />
              </el-form-item>
            </el-col>
            <el-col :span="approvalData.needCharge === 1 ? 12 : 24">
              <el-form-item
                label="是否需要收费："
                label-width="140px"
                prop="needCharge"
              >
                <el-radio-group v-model="approvalData.needCharge">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="approvalData.needCharge === 1">
              <el-form-item label="金额：" prop="money">
                <el-input
                  class="filter-item"
                  v-model="approvalData.money"
                  placeholder="请输入"
                  oninput="value=value.replace(/[^\d]/g,'')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注：" prop="remarks">
                <el-input
                  class="filter-item"
                  v-model="approvalData.remarks"
                  placeholder="请输入"
                  style="width: 100%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="审批流：">
                <approver
                  :approverList="approvalData.approver"
                  @handleChooseapprover="handleChooseApprover"
                />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="抄送：" prop="cc">
                <el-select
                  v-model="approvalData.cc"
                  multiple
                  filterable
                  remote
                  reserve-keyword
                  :remote-method="remoteMethod"
                  :loading="executorLoading"
                  style="display: block"
                  class="multiple-select"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in executorList"
                    :key="item.userId"
                    :label="item.showName"
                    :value="item.userId"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <!-- 详情 -->
        <el-form
          :model="approvalDetail"
          size="mini"
          label-position="right"
          label-width="110px"
          v-else
        >
          <el-row :gutter="20">
            <el-col :span="24" class="clue-title">审批详情</el-col>
            <el-col :span="12">
              <el-form-item label="审批类型：">
                {{
                  approvalDetail.projectBid.approvalType | approvalTypeFilter
                }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="招标方式：">
                {{
                  approvalDetail.projectBid.biddingMethod | biddingMethodFilter
                }}
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item label="报名平台：">
                {{ approvalDetail.projectBid.registrationPlatform }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="报名日期：">
                {{ approvalDetail.projectBid.registrationDate }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="开标日期：">
                {{ approvalDetail.projectBid.openingDate }}
              </el-form-item>
            </el-col>
            <el-col :span="approvalDetail.cooperativeProject === 1 ? 12 : 24">
              <el-form-item label="是否为合作投标项目：" label-width="180px">
                {{
                  approvalDetail.projectBid.cooperativeProject === 1
                    ? "是"
                    : "否"
                }}
              </el-form-item>
            </el-col>
            <el-col
              :span="12"
              v-if="approvalDetail.projectBid.cooperativeProject === 1"
            >
              <el-form-item label="合作方：" label-width="180px">
                {{ approvalDetail.projectBid.partners }}
              </el-form-item>
            </el-col>
            <el-col
              :span="approvalDetail.projectBid.needCharge === 1 ? 12 : 24"
            >
              <el-form-item label="是否需要收费：">
                {{ approvalDetail.projectBid.needCharge === 1 ? "是" : "否" }}
              </el-form-item>
            </el-col>
            <el-col
              :span="12"
              v-if="approvalDetail.projectBid.needCharge === 1"
            >
              <el-form-item label="金额：" label-width="180px">
                {{ approvalDetail.projectBid.money }}
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="审批流：">{{
                approvalDetail.projectBidTasks &&
                approvalDetail.projectBidTasks.length > 0
                  ? approvalDetail.projectBidTasks
                      .map((item) => item.userName)
                      .toString()
                  : ""
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="抄送：">{{
                approvalDetail.projectBid.cc
              }}</el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="备注：">{{
                approvalDetail.projectBid.remarks
              }}</el-form-item>
            </el-col>
          </el-row>
          <!-- approval -->
          <div v-if="approvalDialogType === 'approval'">
            <el-form-item label="是否通过" prop="state">
              <el-radio-group v-model="approvalObjForm.state">
                <el-radio :label="1">是</el-radio>
                <el-radio :label="2">否</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="原因" prop="approvalOpinion">
              <el-input
                class="input-item"
                v-model="approvalObjForm.approvalOpinion"
                placeholder="请输入"
                maxlength="20"
              ></el-input>
            </el-form-item>
          </div>
        </el-form>
        <span
          slot="footer"
          class="dialog-footer"
          v-if="
            approvalDialogType === 'approval' || approvalDialogType === 'add'
          "
        >
          <el-button @click="approvalDialog = false">取 消</el-button>
          <el-button type="primary" @click="handleClickAddApproval"
            >确 定</el-button
          >
        </span>
      </el-dialog>

    </div>
  </div>
</template>

<script>
import { projectExaminationApprovalTypeArr } from '@/staticDict/static.js';
import { BusinessOpportunities } from '@/api/commercial.js';
import { Administration } from '@/api/projectAdministration.js';
import selectPeople from '@/components/selector/selectPeople.vue';
import { SystemController } from '@/api';
import projectConfig from '@/core/config';
import { getToken, getType } from '@/utils';
// import WorkflowSelect from '@/components/WorkflowSelect/index.vue';
import Upload from './components/Upload.vue';
import approver from './components/approver';
import approver1 from './components/approver1';
import approver2 from './components/approver2';
import approverRoleCc from './components/approverRoleCc';
import approverUserCc from './components/approverUserCc';
import approvalDialog from '@/views/Projects/projectApproval/approvalDialog.vue';
export default {
  name: 'projectsDetail',
  props: {
    typeId: {
      default: undefined
    }
  },
  filters: {
    statusFilter (val) {
      const data = {
        1: '进行中',
        2: '已完成'
        // 3: '已完成'
      };
      return data[val];
    },
    projectVerifyStatusFilter (val) {
      const data = {
        1: '待立项',
        2: '立项中',
        3: '立项通过/执行中',
        4: '立项驳回',
        5: '任务完成',
        6: '归档中',
        7: '归档成功/待复盘',
        8: '归档驳回',
        9: '复盘中',
        10: '已完成',
        11: '审批完成'
      };
      return data[val];
    },
    stageNumberFilter (val) {
      const data = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
      return data[val];
    },
    leaderFlagFilter (val) {
      const data = {
        0: '负责人',
        1: '协作人',
        2: '关键因素推动人',
        3: '外资企业',
        4: '合资企业',
        5: '私营企业',
        6: '事业单位',
        7: '国家行政机关'
      };
      return data[val];
    },
    reviewStatusFilter (val) {
      const data = {
        1: '待审批',
        2: '审批驳回',
        3: '审批通过'
      }
      return data[val]
    },
    verifyStatusFilter (val) {
      const data = {
        0: '待审批',
        1: '审批通过',
        2: '审批驳回'
      }
      return data[val]
    },
    approvalTypeFilter (val) {
      let obj = projectExaminationApprovalTypeArr.find(v => v.value === val);
      return obj?.label;
    },
    biddingMethodFilter (val) {
      const data = {
        1: '公开邀标',
        2: '邀标',
        3: '议标"'
      };
      return data[val];
    },
    isFilter (val) {
      const data = {
        0: '否',
        1: '是'
      };
      return data[val];
    }
  },
  components: {
    // WorkflowSelect,
    Upload,
    selectPeople,
    approver,
    approver1,
    approver2,
    approverRoleCc,
    approverUserCc
  },
  data () {
    return {
      infoDetail: {}, // 项目详情
      processTask: [], // 项目审批进度
      projectInitiationTasks: {}, // 项目任务
      projectInitiationProcesses: [],
      projectUsers: [], // 项目成员
      contract: null, // 合同信息
      businessOne: null, // 商机信息
      clueDoOne: null, // 线索信息
      isShowRelation: false, // 是否展开关联的合同、商机、线索信息
      token: getToken(),
      loading: false,
      isShowloading: false,
      executorLoading: false,
      detailData: {
        parentName: []
      },
      approvalObjForm: {},
      oppoId: this.$route.query.oppoId,
      // 商机动态分页参数
      oppoqueryParams: {
        current: 1,
        size: 10
      },
      // 商机动态列表
      oppoDynamicList: [],
      // 商机动态总条数
      oppoDynamicTotal: 0,
      // 线索动态分页参数
      cluequeryParams: {
        current: 1,
        size: 10
      },
      // 线索动态列表
      clueDynamicList: [],
      // 线索动态总条数
      clueDynamicTotal: 0,
      bidData: {},
      groupData: [],
      groupList: [],
      groupTotal: 0,
      groupParams: {
        loginName: '',
        page_size: 10,
        pageNo: 1
      },
      // 商机任务
      taskDialog: false,
      taskResultDialog: false,
      selectPeoplebox: false,
      taskDialogType: 'add',
      taskItem: [],
      taskData: {
        approver: [] // 审批流
      },
      executorList: [], //   执行人list
      taskDetail: {},
      taskList: [],
      projectUserDtoList: [], // 项目成员列表
      deliverData: {},
      approvalForm: {
        state: 1, // 审批是否通过
        approvalOpinion: ''// 审批意见/原因
      },
      // 商机审批
      approvalDialog: false,
      approvalData: {},
      approvalList: [],
      approvalDetail: {},
      approvalDialogType: 'add',
      // 附件
      action: projectConfig.baseUrl + 'admin/knowledge/fileUpload',
      fileLists: [],
      acceptStr:
        '.doc,.docx,.xls,.xlsx,.jpg,.png,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
      clueDetail: { parentName: [] },
      allRules: {
        biddingMethod: [
          { required: true, message: '请选择招标方式', trigger: 'change' }
        ],
        taskName: [{ required: true, message: '请选择', trigger: 'blur' }],
        executorList: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
        isAudit: [{ required: true, message: '请选择', trigger: 'change' }],
        beganDate: [{ required: true, message: '请选择', trigger: 'change' }],
        endDate: [{ required: true, message: '请选择', trigger: 'change' }],
        tenderMethod: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
        examinationApprovalType: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
        registrationDeadline: [
          { required: true, message: '请选择', trigger: 'change' }
        ],
        bidOpenDate: [{ required: true, message: '请选择', trigger: 'change' }],
        isBid: [{ required: true, message: '请选择', trigger: 'change' }],
        isCharge: [{ required: true, message: '请选择', trigger: 'change' }]
      },
      projectId: '', // 项目ID
      archiveDetail: {}, // 归档详情
      isShow: 0 // 是否展示项目归档按钮（用于区分是从项目管理跳转过来还是其他跳转过来，不展示0，展示1）
    };
  },
  created () {
    this.projectId = this.$route.query.projectId
    this.isShow = this.$route.query.isShow
  },
  mounted () {
    this.loadDetailWidgetData()
    this.getApprovalList()
  },
  methods: {
    // 删除商机审批
    handleClickDelApproval (row) {
      this.$confirm('确定要删除吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let params = {
          id: row.id
        };
        await Administration.delProjectbid(this, params);
        this.getApprovalList();
      }).catch(() => { });
    },
    // 项目审批重新提交
    againAddProjectApproval (row) {
      this.$dialog.show('重新提交项目审批', approvalDialog, {
        area: ['900px', '90vh']
      }, {
        detailData: this.infoDetail,
        approvalDetail: row,
        isAgain: true,
        callback: async (params, cb) => {
          params = {
            ...params,
            projectId: this.projectId
          }
          await Administration.updateProjectbid(this, params);
          cb();
        }
      }).then((isDetermine) => {
        if (!isDetermine) {
          return false;
        }
        this.$message({
          message: '重新提交成功',
          type: 'success'
        });
        this.getApprovalList();
      }).catch(e => { });
    },
    // 项目审批添加
    addProjectApproval () {
      this.$dialog.show('添加项目审批', approvalDialog, {
        area: ['900px', '90vh']
      }, {
        detailData: this.infoDetail,
        callback: async (params, cb) => {
          params = {
            ...params,
            projectId: this.projectId
          }
          await Administration.addApproval(this, params);
          cb();
        }
      }).then((isDetermine) => {
        if (!isDetermine) {
          return false;
        }
        this.$message({
          message: '添加成功',
          type: 'success'
        });
        this.getApprovalList();
      }).catch(e => { });
    },
    // 查看审批意见
    handleClickViewApprovalOpinion (row) {
      this.$dialog.show('审核意见', approver, {
        area: ['600px', '50vh']
      }, {
        approverList: row.approvalApprovaer,
        readonly: true
      })
        .then(() => { })
        .catch(() => { });
    },
    // 审批查看详情
    handleClickDetail (row) {
      this.$dialog.show('审批详情', approvalDialog, {
        area: ['900px', '90vh']
      }, {
        detailData: this.infoDetail,
        approvalDetail: row,
        readonly: true
      }).then(() => { }).catch(e => { });
    },
    // 审批的审核按钮 isAudit true: 审批;
    handleClickApprovalDetail (row) {
      this.$dialog.show('项目审批审核', approvalDialog, {
        area: ['900px', '90vh']
      }, {
        detailData: this.infoDetail,
        approvalDetail: row,
        readonly: true,
        isAudit: true,
        callback: async (params, cb) => {
          params = {
            ...params,
            bidId: row.id
          }
          await Administration.Approval(this, params);
          cb();
        }
      }).then((isDetermine) => {
        if (!isDetermine) {
          return false;
        }
        this.$message({
          message: '审批完成',
          type: 'success'
        });
        this.getApprovalList();
      }).catch(e => { });
    },
    // 选择执行人
    selectExecutor () {
      this.$nextTick(() => {
        this.taskData.executorName = this.$refs.selectExecutor.selected.map(item => item.label);
      })
    },
    // 项目任务审批人选择
    handleChooseApproverTask (approver) {
      this.taskData.approver = approver
      console.log(this.taskData.approver)
    },
    // 抄送角色选择
    handleChooseapproverRoleCc (approver) {
      this.taskData.roleCcList = approver
      console.log('抄送角色选择', this.taskData.roleCcList);
    },
    // 抄送人选择
    handleChooseapproverUserCc (approver) {
      this.taskData.userCcList = approver
      console.log('抄送人员选择', this.taskData.userCcList);
    },
    // 审批人选择
    handleChooseApprover (approver) {
      this.approvalData.approver = approver
    },
    // 项目复盘
    handleClickProjectreview () {
      this.$router.push({
        path: '/ProjectsAnalyseAdd',
        query: {
          projectId: this.projectId,
          projectName: this.infoDetail.projectName,
          projectCode: this.infoDetail.projectCode,
          businessType: this.infoDetail.businessTypeNameList.toString()
        }
      });
    },
    // 项目归档
    handleClickProjectArchive () {
      this.$router.push({
        path: '/ProjectArchive',
        query: {
          projectId: this.projectId,
          verifyStatus: this.infoDetail.verifyStatus
        }
      });
    },
    /**
     * 项目简介
     */
    loadDetailWidgetData () {
      let params = {
        id: this.$route.query.projectId
      };
      return new Promise((resolve, reject) => {
        Administration.detail(this, params).then(res => {
          this.infoDetail = res.data.project || {} // 项目
          this.processTask = res.data.processTask.data // 项目审批流
          this.projectInitiationTasks = res.data.collect // 项目任务
          this.projectUsers = res.data.projectUsers // 项目成员
          this.contract = res.data.contract || null // 合同信息
          this.businessOne = res.data.BusinessOne || null // 商机信息
          this.clueDoOne = res.data.ClueDoOne || null // 线索信息
          let filePath = this.infoDetail?.filePath;
          this.infoDetail.filePath = getType(filePath).isString ? JSON.parse(filePath) : filePath;
          this.getOppoDynamicList()
          this.getClueDynamicList()
          if (this.infoDetail.verifyStatus >= 6) {
            this.getArchiveDetail()
          }
        }).catch(e => {
          reject(e);
        });
      });
    },
    // 获取归档详情
    getArchiveDetail () {
      Administration.getArchiveInfo(this, { id: this.projectId })
        .then((res) => {
          this.archiveDetail = res.data;
          this.archiveDetail.projectInitiationTaskServiceOne.forEach(v => {
            v.accessoryList = getType(v.accessoryList).isString ? JSON.parse(v.accessoryList) : v.accessoryList;
          });
        })
    },
    /**
     * 新增成员
     */
    setPeople () {
      this.selectPeoplebox = true
      localStorage.setItem('projectUsers', JSON.stringify(this.projectUsers))
      this.$nextTick(() => {
        this.$refs.selectPeople.info(this.projectUsers)
      })
    },
    getPeople (data) {
      if (data.length !== 0) {
        this.projectUsers = []
        data.forEach(item => {
          item.deptName = item.deptName || item.deptIdDictMapname
          item.jobs = item.postName || item.userTypeDictMapname
        })
        this.projectUsers = data.map(item => {
          return {
            ...item,
            createName: item.createName || item.showName
          }
        })
      } else {
        this.projectUsers = JSON.parse(localStorage.getItem('projectUsers'))
        localStorage.setItem('projectUsers', '')
      }
      let params = {
        projectUserList: this.projectUsers.map(item => {
          return {
            leaderFlag: item.leaderFlag,
            projectId: this.projectId,
            userId: item.userId
          }
        })
      }
      Administration.addProjectsUsers(this, params).then(res => {
      })
    },
    // 删除项目成员
    deleteUserDtoList (row) {
      this.$confirm('是否删除此成员', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          let params = {
            id: row.userId,
            projectId: this.projectId
          }
          Administration.deleteProjectsUsers(this, params).then(res => {
            this.$message({
              message: '删除成功',
              type: 'success'
            });
            this.loadDetailWidgetData()
          })
        })
        .catch(() => { });
    },
    // 下载附件
    handleClickEnclosure (url) {
      window.location.href = url;
    },
    // 锚点
    handleClickAnchor (name) {
      setTimeout(() => {
        this.$refs[name].scrollIntoView({ behavior: 'smooth' });
      }, 0);
    },
    /**
     * 商机审批
     */
    // 添加审批
    handleClickAddApproval () {
      if (this.approvalDialogType === 'approval') {
        Administration.Approval(this, {
          ...this.approvalObjForm,
          bidId: this.approvalDetail.projectBid.id,
          id: this.approvalDetail.projectBid.taskId
        }).then((res) => {
          this.getApprovalList();
          this.$message({
            message: '审批成功',
            type: 'success'
          });
          this.approvalDetail = { projectBid: {}, projectBidTasks: [] }
          this.approvalDialog = false;
        });
      } else {
        this.$refs['approvalForm'].validate((valid) => {
          if (valid) {
            this.approvalData.approvalTypeName = this.$options.filters[
              'approvalTypeFilter'
            ](this.approvalData.approvalType);
            this.approvalData.biddingMethodName = this.$options.filters[
              'biddingMethodFilter'
            ](this.approvalData.biddingMethod);
            Administration.addApproval(this, {
              ...this.approvalData,
              cc: this.approvalData.cc?.toString(),
              projectId: this.projectId
            }).then((res) => {
              this.getApprovalList();
              this.$message({
                message: '添加成功',
                type: 'success'
              });
              this.approvalDetail = { projectBid: {}, projectBidTasks: [] }
              this.approvalDialog = false;
            });
          }
        });
      }
    },
    // 审批列表
    getApprovalList () {
      Administration.approvalList(this, {
        projectId: this.projectId,
        current: 1,
        size: 100000
      }).then((res) => {
        this.approvalList = res.data.records;
      });
    },
    // 获取审批详情
    getApprovalView (row) {
      Administration.approvalView(this, {
        id: row.id
      }).then((res) => {
        this.approvalDetail = res.data;
        if (!this.approvalDetail) {
          this.approvalDetail = { projectBid: {}, projectBidTasks: [] }
        }
        this.approvalDetail.projectBid.taskId = row.taskId
      });
      // this.approvalDetail = row;
      // this.approvalDialogType = 'approval';
      // this.approvalDialog = true;
    },
    /**
     * 商机任务
     */
    // 添加任务
    handleClickAddTask () {
      if (this.taskDialogType === 'approval') {
        Administration.upProjectInitiationProcess(this, {
          ...this.approvalForm,
          taskId: this.taskDetail.id,
          id: this.taskDetail.processTaskId
        }).then((res) => {
          if (res.success) {
            this.$message({
              message: '审批完成',
              type: 'success'
            });
            this.taskDialog = false;
            this.taskItem = []
            this.loadDetailWidgetData()
          }
        });
      } else {
        // taskForm
        this.$refs['taskForm'].validate((valid) => {
          if (valid) {
            if (this.taskData && this.taskData.id) {
              Administration.updateTask(this, {
                ...this.taskData,
                executor: this.taskData.executor?.toString(), // 执行人Id集合
                executorName: this.taskData.executorName?.toString() // 执行人名称集合
              }).then((res) => {
                if (res.success) {
                  this.$message({
                    message: '修改成功',
                    type: 'success'
                  });
                  this.taskDialog = false;
                  this.taskData = {}
                  this.taskDetail = {}
                  this.loadDetailWidgetData()
                }
              });
            } else {
              console.log(this.taskData, '新增任务表单内容')
              Administration.addTask(this, {
                ...this.taskData,
                executor: this.taskData.executor?.toString(), // 执行人Id集合
                executorName: this.taskData.executorName?.toString(), // 执行人名称集合
                businessStage: this.taskItem[0].businessStage,
                businessType: this.taskItem[0].businessType,
                businessTypeCode: this.taskItem[0].businessTypeCode,
                businessTypeName: this.taskItem[0].businessTypeName,
                stageNumber: this.taskItem[0].stageNumber,
                stageName: this.taskItem[0].stageName,
                projectId: this.projectId
              }).then((res) => {
                if (res.success) {
                  this.$message({
                    message: '添加成功',
                    type: 'success'
                  });
                  this.taskDialog = false;
                  this.taskItem = []
                  this.loadDetailWidgetData()
                }
              });
            }
          }
        });
      }
    },
    // 成果交付
    handleClickDeliver () {
      Administration.deliverTask(this, {
        ...this.deliverData,
        id: this.taskDetail.id,
        Examine: this.taskDetail.examine
      }).then((res) => {
        this.$message({
          message: '提交成功',
          type: 'success'
        });
        this.taskDialog = false;
        this.deliverData = {}
        this.taskDetail = {}
        this.loadDetailWidgetData();
      });
    },
    // 任务执行人搜索
    remoteMethod (query) {
      this.executorLoading = true;
      SystemController.getUserList(this, {
        orderParam: [{ asc: false, fieldName: 'loginName' }],
        pageParam: {
          pageNum: 1,
          pageSize: 100000
        },
        sysUserDtoFilter: { loginName: query }
      })
        .then((res) => {
          this.executorList = res.data.dataList;
          this.executorLoading = false;
        })
        .catch((e) => {
          this.executorLoading = false;
        });
    },
    // 成果交付
    handleClickTaskItem (row, type) {
      this.taskDetail = row;
      console.log(this.taskDetail.accessory, 2282)
      console.log(this.taskDetail, 2285)
      let filePath = this.taskDetail?.accessory;
      this.taskDetail.accessory = getType(filePath).isString ? JSON.parse(filePath) : filePath;
      console.log(this.taskDetail.accessory, 2287)
      if (type === 'reissue') {
        this.taskData = { ...row, executor: row.executor?.split(',') }
        // delete this.taskData.id
      }
      this.taskDialogType = type;
      this.taskDialog = true;
      this.remoteMethod()
    },
    handleClickTaskResult (row) {
      this.taskDetail = row;
      console.log(this.taskDetail, 2341)
      let accessory = this.taskDetail?.accessory;
      this.taskDetail.accessoryList = getType(accessory).isString ? JSON.parse(accessory) : accessory;
      this.taskResultDialog = true;
    },
    handleDeleteTask (row) {
      this.$confirm('确定要删除吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        Administration.deleteByTask(this, {
          id: row.id,
          achievementFlag: row.achievementFlag
        }).then((res) => {
          if (res.success) {
            this.$message({
              message: '删除成功',
              type: 'success'
            });
            this.loadDetailWidgetData();
          }
        });
      })
    },
    handleClickAddBtn (item) {
      this.taskDialogType = 'add';
      this.taskItem = item
      this.taskDialog = true;
    },
    getGroupList () {
      BusinessOpportunities.listTeam(this, this.oppoId).then((res) => {
        this.groupData = res.data;
      });
    },
    handleDeleteGroup (row) {
      BusinessOpportunities.deleteTeam(this, {
        tId: row.tId,
        userId: row.userId,
        oppoId: this.oppoId
      }).then((res) => {
        this.getGroupList();
        this.$message({
          message: '已删除',
          type: 'success'
        });
      });
    },
    // 分页
    handleSizeChangeGroup (val) {
      this.groupParams.page_size = val;
      this.getUserList();
    },
    handleCurrentChangeGroup (val) {
      this.groupParams.pageNo = val;
      this.getUserList();
    },
    getUserList (type) {
      if (type) {
        this.groupParams.pageNo = 1;
      }
      SystemController.getUserList(this, {
        orderParam: [{ asc: false, fieldName: 'loginName' }],
        pageParam: {
          pageNum: this.groupParams.pageNo,
          pageSize: this.groupParams.page_size
        },
        sysUserDtoFilter: { loginName: this.groupParams.loginName }
      })
        .then((res) => {
          this.groupList = res.data.dataList;
          this.groupTotal = res.data.totalCount;
        })
        .catch((e) => { });
    },
    handleCloseBid () { },
    getUserStatusType (status) {
      if (status === this.SysUserStatus.NORMAL) {
        return 'success';
      } else if (status === this.SysUserStatus.LOCKED) {
        return 'danger';
      } else {
        return 'info';
      }
    },
    // 商机动态分页改变
    handleSizeChangeOppo (val) {
      this.oppoqueryParams.size = val;
      this.getOppoDynamicList();
    },
    // 商机动态切换页
    handleCurrentChangeOppo (val) {
      this.oppoqueryParams.current = val;
      this.getOppoDynamicList();
    },
    // 商机动态查询列表
    getOppoDynamicList () {
      Administration.dynamicOppoList(this, {
        ...this.oppoqueryParams,
        clueId: this.businessOne?.id
      }).then((res) => {
        this.oppoDynamicList = res.data.records;
        this.oppoDynamicTotal = res.data.total;
      });
    },
    // 线索动态分页改变
    handleSizeChangeClue (val) {
      this.cluequeryParams.size = val;
      this.getClueDynamicList();
    },
    // 线索动态切换页
    handleCurrentChangeClue (val) {
      this.cluequeryParams.current = val;
      this.getClueDynamicList();
    },
    // 线索动态查询列表
    getClueDynamicList () {
      Administration.dynamicList(this, {
        ...this.cluequeryParams,
        clueId: this.clueDoOne?.id
      }).then((res) => {
        this.clueDynamicList = res.data.records;
        this.clueDynamicTotal = res.data.total;
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.require::before {
  content: "*";
  color: #f56c6c;
  margin-right: 4px;
}
.clueDetail {
  position: relative;
  padding: 20px;
  /deep/.el-step__description {
    padding: 0 10px !important;
  }
  .project-status {
    font-size: 14px;
    font-weight: 500;
    color: #1188ff;
    margin: 0 10px;
    // text-decoration: underline;
  }
  .clue-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 20px;
    margin-bottom: 10px;
  }

  .del-disabled{
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: not-allowed;
    padding: 8px 16px;
    font-size: 12px;
    color:#C0C4CC;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    transition: .1s;
    font-weight: 500;
  }
  .clue-form {
    .clue-title {
      font-size: 16px;
    }
  }
  .line {
    width: 100%;
    height: 2px;
    background: rgba(242, 242, 242, 1);
    margin-bottom: 15px;
  }
  .relation-show {
    text-align: center;
    cursor: pointer;
    text-decoration: underline;
    color: #1188ff;
  }
  .dynamic {
    padding: 20px;
    border-radius: 8px;
    background: rgba(242, 242, 242, 0.3);
    .dynamic-item {
      display: flex;
      align-items: center;
      margin-bottom: 30px;
      .avatar {
        width: 40px;
        height: 40px;
        border-radius: 40%;
        margin: 0 auto;
        display: block;
        margin-bottom: 6px;
      }
      .dynamic-content {
        min-height: 40px;
        margin-bottom: 6px;
      }
      .dynamic-time {
        color: #d7d7d7;
      }
    }
    .dynamic-release {
      margin-top: 50px;
    }
    .release-btn {
      margin-top: 20px;
      text-align: right;
    }
  }
}
.el-date-editor,
.workflow-select,
.el-select {
  width: 250px;
}
.group-dialog .el-select {
  width: auto;
}
.anchor {
  position: absolute;
  right: 15px;
  top: 70px;
  border-radius: 8px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  z-index: 10;
  .anchor-item {
    padding: 8px 15px;
    background-color: #fff;
    // border-bottom: 1px solid #d7d7d7;
    cursor: pointer;
    &:last-child {
      border: none;
    }
    &:hover{
      background: #d7d7d7;
    }
  }
}
.project-detail {
  padding: 0 !important;
}
.enclosure {
  display: flex;
  flex-wrap: wrap;
  .enclosure-item {
    flex-shrink: 0;
    width: 80px;
    margin-right: 20px;
    margin-bottom: 15px;
    img {
      width: 50px;
      height: 50px;
      object-fit: cover;
      margin: 0 auto;
      display: block;
    }
    .enclosure-name {
      width: 100%;
      text-align: center;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}
</style>
<style>
.multiple-select .el-select__tags {
  overflow-x: auto;
  flex-wrap: nowrap;
}
.multiple-select .el-select__input {
  min-width: 20px;
}
.project-detail .el-form-item__label {
  font-weight: bold;
}
.approval-group-radio .el-radio-group{
  top: 0 !important;
  left: 0 !important;
}
</style>
